<template>
  <view class="footer">
    <up-tabbar :value="current">
      <up-tabbar-item v-for="(item,index) in menus" :key="index"  :text="item.text" @click="handleClick(item)" >
        <template #active-icon>
          <image
            class="u-page__item__slot-icon"
            :src="item.activeIcon"
          ></image>
        </template>
        <template #inactive-icon>
          <image
            class="u-page__item__slot-icon"
            :src="item.icon"
          ></image>
        </template>
      </up-tabbar-item>
    </up-tabbar>
  </view>
</template>
<script lang="ts" setup>
import { redirect } from '@/utils/common';
import { ref } from 'vue'
const prop = defineProps({
  current: {
    type: Number,
    default: 0
  }
})
const menus = ref([
  {
    text: '首页',
    icon: 'https://static.fastht.com/h5_store/nav/shouye.png',
    activeIcon: 'https://static.fastht.com/h5_store/nav/shouye_act.png',
    link: '/addon/htscrm/pages/admin/index'
  },
  {
    text: '活动',
    icon: 'https://static.fastht.com/h5_store/nav/huodong.png',
    activeIcon: 'https://static.fastht.com/h5_store/nav/huodong_act.png',
    link: '/addon/htscrm/pages/admin/activity/index'
  },
  {
    text: '客户',
    icon: 'https://static.fastht.com/h5_store/nav/kehu.png',
    activeIcon: 'https://static.fastht.com/h5_store/nav/kehu_act.png',
    link: '/addon/htscrm/pages/admin/customer/index'
  },
  {
    text: '我的',
    icon: 'https://static.fastht.com/h5_store/nav/wode.png',
    activeIcon: 'https://static.fastht.com/h5_store/nav/wode_act.png',
    link: '/addon/htscrm/pages/admin/my'
  }
])

function handleClick(item: any) {
  console.log(item);
  redirect({
    url: item.link,
    mode: 'redirectTo'
  })
}
</script>

<style lang="scss" scoped>
.u-tabbar {
  flex: auto;
}
.u-page__item__slot-icon{
  width: 40rpx;
  height: 40rpx;
}
</style>